import { uploadFileComponent, excelComponent } from '@mctech/js-fs-client'
import round from 'lodash.round'
import dayjs from 'dayjs'
import calculationSteps from './calculation-steps/index.vue'
import editableText from './editable-text.vue'
import DblclickEditableText from './dblclick-editable-text.vue'
import cmpPopupEditor from './popup-editor.vue'
import cusExpander from './cus-expander.vue'
import emptyPanel from './empty-panel.vue'
import CmpCheckbox from './checkbox.vue'
import cmpLoading from './loading.vue'
import cmpOption from './option.vue'
import cmpDialog from './dialog/dialog.vue'
import cmpCrumb from './crumbs.vue'
import cmpPage from './page.vue'

Vue.component('CmpUploadFile', uploadFileComponent)
Vue.component('calculationSteps', calculationSteps)
Vue.component('DblclickEditableText', DblclickEditableText)
Vue.component('cmpPopupEditor', cmpPopupEditor)
Vue.component('CmpEditableText', editableText)
Vue.component('CmpExcelFile', excelComponent)
Vue.component('cusExpander', cusExpander)
Vue.component('CmpCheckbox', CmpCheckbox)
Vue.component('cmpEmpty', emptyPanel)
Vue.component('emptyPanel', emptyPanel)
Vue.component('cmpLoading', cmpLoading)
Vue.component('cmpOption', cmpOption)
Vue.component('cmpDialog', cmpDialog)
Vue.component('CmpCrumbs', cmpCrumb)
Vue.component('cmpPage', cmpPage)

Vue.filter('setSubcontractStatus', val => {
  const obj = {
    signed: '已签订',
    performing: '履约中',
    finished: '已完工',
    settled: '已结算'
  }

  return obj[val]
})

Vue.filter('setSubcontractStatusBgColor', val => {
  const obj = {
    signed: {
      border: '1px solid #008CD6',
      color: '#008CD6',
      backgroundColor: '#daf3ff',
      borderRadius: '2px'
    },
    performing: {
      border: '1px solid #F4AF61',
      color: '#F4AF61',
      backgroundColor: '#fff5e9',
      borderRadius: '2px'
    },
    finished: {
      border: '1px solid #00B25A',
      color: '#00B25A',
      backgroundColor: '#d5ffe8',
      borderRadius: '2px'
    },
    settled: {
      border: '1px solid #BFBFBF',
      color: '#BFBFBF',
      backgroundColor: '#ececec',
      borderRadius: '2px'
    }
  }

  return obj[val]
})

Vue.filter('getFileSize', size => {
  const unit = ['Bytes', 'KB', 'MB', 'GB']
  let unitIndex = 0
  let leftSize = size
  while (unitIndex < unit.length && leftSize > 1024) {
    leftSize = leftSize / 1024
    unitIndex++
  }
  return `${round(leftSize, 2)}${unit[unitIndex]}`
})

Vue.filter('formatValue', (value, digits = 2) => {
  return round(value, digits)
})

Vue.filter('formatDate', (date, formatTemplate = 'YYYY-MM-DD') => {
  return dayjs(date || '').format(formatTemplate)
})
